<!DOCTYPE html>
<html xmlns=http://www.w3.org/1999/xhtml xmlns:bd=http://www.baidu.com/2010/xbdml>
<head>
   
    <meta charset="utf-8">
	<title>更换LOGO</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link Rel="SHORTCUT ICON" href="/pc/login/img/logo1.png">
    <link rel="stylesheet" href="/pc/layui/css/layui.css" media="all" />

    <link href="/pc/private/css/bootstrap.min.css" rel="stylesheet">
    <link href="/pc/private/css/bootstrap-fileinput.css" rel="stylesheet">
    <style type="text/css">
        ul.imglist li{ float:left; padding:4px 8px; width:160px;list-style: none;margin: 10px} 
        ul.imglist li img{ display:block; width:160px; height:90px} 
        ul.imglist li span{ display:block; width:100%; height:30px; line-height:30px; background:#F6F6F6} 
    </style>
</head>
<body>
<div class="container">
	
    <div class="page-header">
        <h3 style="color: #1AA094;">可更改您的LOGO</h3>
        <form id="uploadForm" method="post"  enctype='multipart/form-data'>
        	 {{ csrf_field() }}
            <div class="form-group" style="position: relative;">
                <div class="h4">图片预览</div>
                <p style="position: absolute;top: 3px;left: 73px;font-size: 1px">(图片大小84px X 84px)</p>
                <div class="fileinput fileinput-new" data-provides="fileinput"  id="exampleInputUpload">
                    <div class="fileinput-new thumbnail" style="width: 200px;height: auto;max-height:150px;">
                        <img id='picImg' style="width: 100%;height: auto;max-height: 140px;" src="" alt=""/>
                    </div>
                    <div class="fileinput-preview fileinput-exists thumbnail" style="max-width: 200px; max-height: 150px;"></div>
                    <div>
                        <span class="btn btn-primary btn-file">
                            <span class="fileinput-new">选择文件</span>
                            <span class="fileinput-exists">换一张</span>
                            <input type="file" name="test[]" id="picID" accept="image/gif,image/jpeg,image/x-png"/>

                        </span>
                        <a href="javascript:;" class="btn btn-warning fileinput-exists" data-dismiss="fileinput">移除</a>
                    </div>
                </div>
            </div>
            <button type="button" id="uploadSubmit" class="btn btn-info" lay-filter="upload" lay-submit="">提交</button>

        </form>
    </div>
    
</div>
<div style="width: 100%;height:100%">
<ul class="imglist">
	@if(!empty($data))
		@foreach($data as $v)
			<li class="" style="text-align: center;line-height: 84px;"><img style="margin:0 auto;width:84px;height:84px;"  id="{{$v['id']}}" src="/pc/private/img/agent_{{$agent_id}}/{{$v['name']}}"/>
			<span lay-filter="th" key="{{$v['id']}}" lay-submit="" style="width:84px;background-color:#1AA094;cursor: pointer;color: white;border-radius: 2%;margin: 0 auto;font-size: 10px;height: 20px;line-height: 20px;">点此替换头像</span>
      <span class="del" lay-filter="del" key="{{$v['id']}}" lay-submit="" style="width:84px;background-color:#00FF00;cursor: pointer;color: white;border-radius: 2%;margin: 0 auto;font-size: 10px;height: 20px;line-height: 20px;margin-top: 5px;">点此删除头像</span>
		</li>
  
		@endforeach
	@endif 
</ul> 
</div>
  <script type="text/javascript" src="/pc/layout/js/jquery.min.js"></script>
<script type="text/javascript" src="/pc/layui/layui.js"></script>
<script src="/pc/private/js/bootstrap-fileinput.js"></script>
<script type="text/javascript">
    layui.config({
    base : "js/"
        }).use(['form','layer','jquery','upload','laydate'],function(){
    var form = layui.form(),
        layer = parent.layer === undefined ? layui.layer : parent.layer,
        $ = layui.jquery;
         form.on("submit(upload)",function(data){
            var data = new FormData($('#uploadForm')[0]);
            $.ajax({
                url: '/admin/private/action',
                type: 'POST',
                data: data,
                async: false,  
                cache: false,  
               contentType: false,  
               processData: false,
               dataType:'json',
                success: function (data) {
                 if(data.msg == ""){
                 	var str="";
                  	for(var i=0;i<data.img.length;i++){
                  		str += "<li><img style='margin:0 auto;width:84px;height:84px;' id='"+data.img[0]['img_id']+"' src='/pc/private/img/"+data.img[0]['img_name']+"'/><span lay-filter='th' key='"+data.img[0]['img_id']+"' lay-submit='' style='width:84px;background-color:#1AA094;cursor: pointer;color: white;border-radius: 2%;margin: 0 auto;font-size: 10px;height: 20px;line-height: 20px;'>点此替换头像</span><span  lay-submit='' lay-filter='del' key='"+data.img[0]['img_id']+"' style='width:84px;background-color:#00FF00;cursor: pointer;color: white;border-radius: 2%;margin: 0 auto;font-size: 10px;height: 20px;line-height: 20px;margin-top: 5px;'>点此删除头像</span></li>";
                  	}
                   	$('.imglist').append(str)
                    top.layer.msg("图片上传成功！");
                 
                }else{
                        top.layer.close(index);
                        top.layer.msg("图片上传失败！"); 
                }
                },
                error: function (data) {
                    
                     console.log(data.message);
                }
            });
            return false;
       })
            form.on("submit(th)",function(data){              
            $.ajax({
                url: '/admin/private/update',
                type: 'POST',
                data: {
                    '_token':$('input[name=_token]').val(),
                    'id':$(this).attr('key')
                },
               dataType:'json',
                success: function (data) {
                	console.log(data)
                 if(data.status == 1){
                 	// alert(11)
                 	top.layer.msg("图片替换成功!",{time:800});
                  window.parent.location.reload(); //刷新父页面

                var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                     parent.layer.close(index);  // 关闭layer
                  	}
                  	else{
                    top.layer.msg("图片替换失败！",{time:800}); 
                     }
                 }
            });
            return false;
       }) 
                  form.on("submit(del)",function(data){
            $.ajax({
                url: '/admin/private/destroy',
                type: 'POST',
                data: {
                    '_token':$('input[name=_token]').val(),
                    'id':$(this).attr('key')
                },
               dataType:'json',
                success: function (data) {
                  console.log(data)
                 if(data.status == 1){
                  top.layer.msg("头像删除成功!",{time:800});
                   location.reload(); 
                var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                     parent.layer.close(index);  // 关闭layer
                    }
                    else{
                    top.layer.msg("头像删除失败！",{time:800}); 
                     }
                 }
            });
            return false;
       })
     })       
</script>
</body>
</html>